import React,{forwardRef} from 'react';
import {Form, Input, Radio, Select} from "antd";

const { Option } = Select;
const AddCodeRule = forwardRef((props,ref) =>{
    const [value, setValue] = React.useState(1);
    const onChange = e => {
        console.log('radio checked', e.target.value);
        setValue(e.target.value);
    };

    return (
        <div>
            <Form
                ref={ref}
                layout="vertical"
            >
                <Form.Item
                    name="lineNumber"
                    label="行号"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    name="codeName"
                    label="编码名称"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    name="example"
                    label="示例"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    name="encodPrefix"
                    label="编码前缀"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    name="isAddDate"
                    label="中间是否加入日期"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Radio.Group onChange={onChange} value={value}>
                        <Radio value={0} >是</Radio>
                        <Radio value={1}>否</Radio>
                    </Radio.Group>
                </Form.Item>
                <Form.Item
                    name="isAddTime"
                    label="中间是否加入时间"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Radio.Group onChange={onChange} value={value}>
                        <Radio value={1}>是</Radio>
                        <Radio value={2}>否</Radio>
                    </Radio.Group>
                </Form.Item>
                <Form.Item
                    name="serialNumber"
                    label="流水号位数"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Select>
                        {
                            props.liuShui.map((item,key) =>{
                                return <Option value={item.id} key={key}>{item.liuShui}</Option>
                            })
                        }
                    </Select>
                </Form.Item>
                <Form.Item
                    name="remarks"
                    label="备注"
                    rules={[
                        {
                            required: true,
                            message: 'Please input the title of collection!',
                        },
                    ]}
                >
                    <Input />
                </Form.Item>

            </Form>
        </div>
    );
}
)

export default AddCodeRule;